﻿
/*********Top Banners ***********/
.top-banners { background: none repeat scroll 0 0 #828486;height: 55px;list-style: none outside none;margin:auto 0; }
.top-banners > ul {  width:100%;margin:0 auto; padding:0px;}
.top-banners > ul > li {list-style-type: none; width:19.7%; float:left;}

/*Menu*/
.forecast-updated {color:green; }
.forecast-not-updatedd {color:red; }

/*Titles*/
.wind-page-title{ padding:10px;  color: #3a3a3a; text-shadow: #ccc 2px 2px 1px; font-size:30px;text-align:center; }
.wind-page-title-small {text-align:center; padding:10px;  color: #3a3a3a; text-shadow: #ccc 2px 2px 1px; font-size:18px;}

/*=========================================Pages=============================================*/
/*=========================================Home=============================================*/
/*home Cameras*/
.camera-grid .camera-item{height:100px;width:75px;float:right;position: relative;overflow: hidden;margin:5px;}
.camera-grid .camera-item .picture{width:auto;height:auto;}
.camera-grid .camera-item .picture img{position: absolute; top: 0;right: 0;border: 0; width:75px; height:100px;}
.camera-grid .camera-caption{float: left; position: absolute;background: #dcdcd9;height: 20px; width: 100%;font-family:arial,verdana,helvetica,sans-serif;font-size:11px;}

/*Spot table*/
.spot-table {background-color: #f5f5f5;font-family: arial,verdana,helvetica,sans-serif;font-size: 12px;}
.spot-table th {text-align: center;}
.spot-table th img {vertical-align: middle;width: 12px;height: 12px;}
.spot-table .line {background-color: #fff;}
.spot-table .wind {float:left;background-color: #dddddd;padding: 3px 5px 3px 5px;text-shadow: 1px 1px 1px #fff;border-radius: 5px;min-width: 155px;color: #000;margin-right: 5px;}
.spot-table .wind .time{width:40px;}
.spot-table .wind .speedGust {direction: ltr;width:45px;text-align:left;}
.spot-table .wind .direction {text-align: left;}
.spot-table .wind .direction img {vertical-align: middle;width: 16px;height: 16px;}
.spot-table .wave {float: left;background-color: #dddddd;padding: 3px 5px 3px 5px;text-shadow: 1px 1px 1px #fff;border-radius: 3px;min-width: 155px;color: #000;}
.spot-table .wave .time {width: 40px;}
.spot-table .wave .hight {direction: ltr;width: 50px;text-align:left;}
.spot-table .wave .direction {text-align:left;width:30px;}
.spot-table .wave .icon {text-align: right;}
.spot-table .wave .icon img {vertical-align: middle;width: 14px;height: 14px;}
.spot-table .empty {float: left;min-height: 1px;width: 165px;margin-right: 5px;}
.spot-table .camera img {vertical-align: middle;width: 12px;height: 12px;}
.spot-table .comment img {vertical-align: middle;width: 12px;height: 12px}
.over10knots{color:red;}

/*comment list home*/
.comments-scroller-list {width: 100%;}
    .comments-scroller-list li {height:150px;}

/*=========================================Cameras=============================================*/
.camera-page .camera-item{width:auto;height:200px;width:200px;float:left;position: relative;overflow: hidden;margin:5px;}
.camera-page .camera-item .picture{width:auto;height:auto;}
.camera-page .camera-item .picture img{position: absolute; top: 0;right: 0;border: 0; width:200px; height:200px;}
.camera-page .camera-caption{float:left; position: absolute;background: #dcdcd9;height: 20px; width: 100%;font-family:arial,verdana,helvetica,sans-serif;font-size:12px;}

/*=========================================Forecast=============================================*/
.forecast-links ul{margin-bottom:10px;padding: 0;list-style-type: none;text-align: center;}
.forecast-links ul li { display: inline; margin:10px; }
.tab-content{border:solid 1px #dddddd;padding:5px;}
.windFinder{float:left;margin-left:5px;}
.weatherOnline{background-repeat: no-repeat;float:left;margin-left:5px;}
.uoa{background-repeat: no-repeat;float:left;margin-left:5px;}
.hourTitle {font-size:14px;}
.mapsByHour a{width:120px; height:220px; margin-top:0px;}
.mapsByHour:after{content: ".";display: block;clear: both;}
.windguru IFRAME {position: relative;height: 100%;width: 100%;}
/*waveforecast*/
.wave-graph img {width:200px; height:200px;}
.isImage { float:left;}
.isramar .hour {font-size:20px; font-weight:bold;}

/*metar*/
.metar-home {float:right; text-align: center;}

/*Spot*/
.spot-page .camera-item  img{width: 100%; height: auto;overflow:hidden;}

/*login*/
.auth-btn, .auth-btn .icon { border-radius: 20px; }
.auth-btn { background: transparent; cursor: pointer; font-weight: bold; display: table; height: 37px; line-height: 1.2em; margin-bottom: 12px;overflow: hidden; padding: 0 45px 0 10px; position: relative; width: 155px;margin:0 auto; }
.auth-btn .icon { background-repeat: no-repeat; height: 37px; display: block; left: 0; position: absolute; top: 0; width: 37px; }
.auth-btn:hover .icon { border-radius: 0; }
.auth-btn .message { display: table-cell; vertical-align: middle;}
.auth-btn:hover .message { color: #fff; }
.auth-btn.auth-btn-facebook { color: #3d7199; }
.auth-btn.auth-btn-facebook:hover, .auth-btn.auth-btn-facebook .icon { background-color: #3d7199; }
.auth-btn.auth-btn-facebook .icon { background-image: url("WindImages/login_facebook.png"); background-position: 50% 50%; }
.auth-btn.auth-btn-facebook:hover .icon { background-color: transparent; }

@media screen and (max-width:480px) {
    .spot-table .wind {margin-bottom: 3px;}
    .spot-table .donot-display {display:none;}
}

.unread-private-messages {color:red;}